<template>
  <a-layout class="p-workbench-container">
    <Sider @change-menu-item="changeSiderMenu" />
    <Main :selected-sider-menu-item-key="selectedSiderMenuItemKey" />
  </a-layout>
</template>

<script setup lang="ts">
import Sider from './components/Sider.vue';
import Main from './components/main/index.vue';
import { ref } from 'vue';

const selectedSiderMenuItemKey = ref('');
// 修改侧边栏导航
function changeSiderMenu(selectedKey: string) {
  selectedSiderMenuItemKey.value = selectedKey;
}
</script>

<style scoped lang="scss">
.p-workbench-container {
  width: 100%;
  height: 100%;
}
:deep(.ant-menu) {
  border-width: 0;
  border-inline-end: 0 solid rgba(5, 5, 5, 0.06) !important;
}
</style>
